<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
<title>修改姓名</title>
<%@ include file="/pages/wx/baseHead.jsp"%>
<link rel="stylesheet" href="<%=basePath%>/css/weixin/example.css" />

<!-- 引入封装了failback的接口--initGeetest -->
<script src="http://static.geetest.com/static/tools/gt.js"></script>
<style type="text/css">
#embed-captcha {
            width: 300px;
            margin: 0 auto;
        }
</style>


</head>
<body>
<form action="${urlBasePath }weixin/user/reBindName.do" method="POST" name = "theform">
<div class="hd">
    <h1 class="page_title">
    	修改姓名<br>
    	<a href="javascript:;" class="weui_btn weui_btn_plain_primary weui_btn_mini ">1、输入姓名</a>
    	<a href="javascript:;" class="weui_btn weui_btn_plain_primary weui_btn_mini ">2、点击提交</a>
    </h1>
</div>

<div class="weui_cells weui_cells_form">
	<div class="weui_cell">
            <div class="weui_cell_hd"><label class="weui_label" style="font-weight: normal;min-width: 4em;">姓名：</label></div>
            <div class="weui_cell_bd weui_cell_primary">
                <input class="weui_input" type="text" id="name" name="name" maxlength="12"
                 pattern="^[\u4e00-\u9fa5]*" required="required" 
                placeholder="建议您输入真实姓名"/>
            </div>
      </div>      
      <div class="weui_cell">      
            <div class="weui_cell_bd weui_cell_primary">
            	<div id="embed-captcha"></div>
		    	<p id="wait" class="show">正在加载验证码......</p>
			</div>
        </div>
	<input class="weui_btn weui_btn_primary" id="embed-submit" type="submit" value="保存" />
	<div style="display: block;height: 1em;">&nbsp;</div>
</div>

</form>




<script>

    var handlerEmbed = function (captchaObj) {

        $("#embed-submit").click(function (e) {
            var validate = captchaObj.getValidate();
            if (!validate) {
            	openToast('请先拖动验证码到相应位置');
                e.preventDefault();
            }
        });

        // 将验证码加到id为captcha的元素里
        captchaObj.appendTo("#embed-captcha");

        captchaObj.onReady(function () {
            $("#wait")[0].className = "hide";
        });

        // 更多接口参考：http://www.geetest.com/install/sections/idx-client-sdk.html
    };
    $.ajax({
        // 获取id，challenge，success（是否启用failback）
        url: "${urlBasePath }verify/startCaptcha.do",
        type: "get",
        dataType: "json",
        success: function (data) {
	debugger;
            // 使用initGeetest接口
            // 参数1：配置参数
            // 参数2：回调，回调的第一个参数验证码对象，之后可以使用它做appendTo之类的事件
            initGeetest({
                gt: data.gt,
                challenge: data.challenge,
                product: "embed", // 产品形式，包括：float，embed，popup。注意只对PC版验证码有效
                offline: !data.success // 表示用户后台检测极验服务器是否宕机，一般不需要关注
            }, handlerEmbed);
        }
    });

</script>

<!-- 引入微信样式代码提示工具开始 -->
<%@ include file="/pages/wx/wxClass.jsp"%>
<!-- 引入微信样式代码提示工具结束 -->
<%@ include file="/pages/wx/baseBottom.jsp"%>
</body>
</html>

